// JavaScript Documentvar _buttons;
var STTabMenu = function( container, upStyle, downStyle, selectedStyle )
{
	var _this					= this;
	
	// 변수 선언
	var _container 				= container;
	var _upStyleName 			= upStyle;
	var _downStyleName			= downStyle;
	var _selectedStyleName 		= selectedStyle;
	var _selectedButton;
	var _tempTouchTarget;
	
	// 인데스 관리를 위한 
	var _indexPropertyName		= "__index";
	
	// [[ 		콜백 		]]
	this.onChange = null;			// 버튼이 눌릴때 : function( index )
	
	// 초기화
	var _buttons 				= _container.getElementsByTagName( "div" );
	for( var i=0; i<_buttons.length; i++ )
	{
		var _button = _buttons[i];
		initButton( _button, i );
		setButton( _button );
	}
	
	// 메서드 선언
	function initButton( button, index )
	{
		button[ "_indexPropertyName" ] = index;
	}
	
	function setButton( button )
	{
		button.addEventListener( "mousedown", onDown );
		button.addEventListener( "mouseup", onUp );
		
		button.addEventListener( "touchstart", onDown );
		button.addEventListener( "touchend", onUp );
		button.className = _upStyleName;
	}
	
	function clearButton( button )
	{
		button.removeEventListener( "mousedown", onDown );
		button.removeEventListener( "mouseup", onUp );
		
		button.removeEventListener( "touchstart", onDown );
		button.removeEventListener( "touchend", onUp );
		
		button.className = _selectedStyleName;
	}
	
	function onDown( e )
	{
		_tempTouchTarget = e.currentTarget;
		e.currentTarget.className = _downStyleName;
	}
	
	function onUp( e )
	{	
		if( _tempTouchTarget == e.currentTarget )
		{
			if( _selectedButton )
			{
				setButton( _selectedButton );	
			}
			
			_selectedButton = e.currentTarget;
			clearButton( e.currentTarget );
			
			if( _this.onChange != null )
			{
				_this.onChange( _this.getSelectedIndex() );
			}
		}
		else
		{
			e.currentTarget.className = _upStyleName;
		}
		
		
		
		
	}
	
	
	// [ 외부 지원 메서드 ]
	this.setSelectedIndex = function( value )
	{
		if( _selectedButton != null )
		{
			setButton( _selectedButton );
		}
		_selectedButton = _buttons[ value ];
		clearButton( _selectedButton );
	}
	this.getSelectedIndex = function()
	{
		if( _selectedButton != null )
		{
			return _selectedButton[ "_indexPropertyName" ];
		}
		return -1;
	}
	
	this.autoSize = function()
	{
		if( _buttons.length == 0 ) return;
		var _lastButton = _buttons[ _buttons.length-1 ];
		_container.style.width =  ( _lastButton.offsetLeft+ _lastButton.offsetWidth )+"px";
		_container.style.height =  ( _lastButton.offsetTop+ _lastButton.offsetHeight )+"px";
	}
}